<template>
  <div>
    <div>
      <span>用户名：</span>
      <input type="text" v-model="username" /><br />
      <span>密码：</span>
      <input type="password" v-model="password" />
    </div>
    <div>
      <span>家乡</span>
      <select v-model="from">
        <option value="Beijing">北京市</option>
        <option value="Tianjin">天津市</option>
        <option value="Nanjing">南京市</option>
      </select>
    </div>
    <div>
      <span>爱好</span>
      <input type="checkbox" v-model="hobby" value="eating" />
      <span>吃饭</span>
      <input type="checkbox" v-model="hobby" value="shopping" />
      <span>购物</span>
      <input type="checkbox" v-model="hobby" value="coding" />
      <span>写代码</span>
    </div>
    <div>
      <span>性别：</span>
      <input type="radio" value="male" name="sex" v-model="gender" />男生
      <input type="radio" value="female" name="sex" v-model="gender" />女生
    </div>
    <div>
      <span>自我介绍</span>
      <textarea v-model="intro"></textarea>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: "",
      password: "",
      from: "",
      hobby: [],
      gender: "",
      intro: "",
    };
  },
};
</script>

<style>
</style>